<?php
use yii\helpers\Url;
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport"content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <title>万人秀贝</title>
    <style>
        /*初始化
        *{margin:0px;padding:0px;}
        html{overflow-x:hidden;max-width:640px;margin:0 auto;background:#fff;}
        body{font:16px/32px 'Microsoft YaHei' Arial;color:#333;background:#fff;}
        img[src*="pre.png"]{border:none;background-size:10px 10px;background-position:center center; background-repeat:no-repeat;}
        li{list-style:none;}
        h1,h2{font-size:18px;font-weight:normal;color:#000;line-height: 32px;}
        a{text-decoration:none;-webkit-tap-highlight-color:rgba(0,255,0,0.3);}
        em{font-style:normal;}
        /*page0
         .banner,.content,.shopBox ul,.clock{overflow: hidden;}
         .banner {width:100%;}
         .banner img{width:100%;}

         .content{width: 91.5%;margin:5.1% auto;font-size:"微软雅黑";font-size:28px;}
         .shopBox>p{font-size:28px;color:#333333;}
         .shopBox ul{width:100%;height:13.4%;background:#e4343e;margin:5% 0;color:#fff;text-align:center;}
         .shopBox ul li{width:33.3%;float:left;margin:3% 0;box-sizing: border-box;}
         .shopBox ul li:nth-child(1){border-right:1px solid #fff;}
         .shopBox ul li:nth-child(2){border-right:1px solid #fff;}

         .shopBox ul li p{font-size:24px;}
         .clock{font-size:22px;height:26px;line-height:26px;height:22px;line-height: 26px;color:#4a4a4a;}
         .clock b{color:#e4343e;}

         .intr{width:100%;}
         .intr h4{font-size:28px;margin:7.3%  0 5%;}
         .intr h4 img{vertical-align:center;}
         .intr p{text-indent:2em;font-size:22px;color:#666666;}

         .bottom{width: 100%; height: 8.8%;border-top: 1px solid #565656;text-align: center; position: fixed;  bottom: 0; left: 0;
        }
         .xiangxiatishi{width: 13.125%;position: absolute;top: 31%; left: 44%;}

         @media screen and (max-width: 480px){
          .shopBox>p{font-size:22px;}
            .shopBox ul li p{font-size:18px;}
            .clock{font-size:16px;}
            .intr h4{font-size:22px;}
            .intr p{font-size:16px;}
         }


         #mask{width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0,0,0,0.5);}
         引导标识是在980px中,用绝对定位水平居中,背景图宽是980px，所有先left:50%;到body的一半，再margin-left:-490px;可以居中
         #searchTip{    width: 55.31%;height: 35.89%; position: fixed;left: 20.15%; bottom: 11.58%; opacity: 0.2;}

         .stepA{width:100%;height:100%;background:url(img/zy1.png) no-repeat center;background-size: 100%; position: relative; top: 0; left: 0;}
         .stepA a{width: 68%;  height: 39.1%;opacity: 0.6; cursor: pointer; position: absolute;top: 1%; left: 20%;text-indent:-999px;overflow:hidden;}
          #mask  p{width:37.96%;height:10%;background: #ebebeb;position:fixed;left: 30.78%;bottom:0; opacity:0.4;border-radius: 80px;}*/
    </style>
    <link rel="stylesheet" type="text/css" href="/static/css/commom.css">
    <script src="/static/script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="/static/script/jquery.touchSwipe.min.js"></script>
    <script src="/static/script/commom.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script>
        wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
            appId: 'wxb92c2bb9c487c950', // 必填，公众号的唯一标识
            timestamp: '<?= $data['js_conf']['time']?>', // 必填，生成签名的时间戳
            nonceStr: '<?= $data['js_conf']['noncestr']?>', // 必填，生成签名的随机串
            signature: '<?= $data['js_conf']['signature']?>',// 必填，签名，见附录1
            jsApiList: [
                'onMenuShareTimeline',
                'onMenuShareAppMessage'
            ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
        });
        wx.ready(function(){
            //分享到朋友圈
            wx.onMenuShareTimeline({
                title: '万人秀贝', // 分享标题
                link: 'http://shopbox.10000dt.com/vote/vote', // 分享链接
                imgUrl: 'http://static.bricks.10000dt.com/picture/ohB24Dp8wPE7XQLiAMdr03k59VFmsS.jpg', // 分享图标
                success: function () {
                    $.post("<?= url::to('/vote/vote/share')?>", {type:1}, function(data) {
                        if(data == 1) {
                            msgPopup('分享成功',2000);
                        }else{

                        }
                    })
                },
                cancel: function () {
                    // 用户取消分享后执行的回调函数
                }
            });
            //分享给朋友
            wx.onMenuShareAppMessage({
                title: '万人秀贝', // 分享标题
                desc: '万人秀贝，秀出自我', // 分享描述
                link: 'http://shopbox.10000dt.com/vote/vote', // 分享链接
                imgUrl: 'http://static.bricks.10000dt.com/picture/ohB24Dp8wPE7XQLiAMdr03k59VFmsS.jpg', // 分享图标
                type: 'link', // 分享类型,music、video或link，不填默认为link
                dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
                success: function () {
                    $.post("<?= url::to('/vote/vote/share')?>", {type:2}, function(data) {
                        if(data == 1) {
                            msgPopup('分享成功',2000);
                        }else{

                        }
                    })
                },
                cancel: function () {
                    // 用户取消分享后执行的回调函数
                }
            });
        });
        wx.error(function(res){

        });
    </script>
    <script>
        /*$(function(){
         show_time();
         });

         function show_time(){
         var time_start = new Date().getTime(); //设定当前时间
         var time_end =  new Date("2017/01/01 00:00:00").getTime(); //设定目标时间
         // 计算时间差
         var time_distance = time_end - time_start;
         // 天
         var int_day = Math.floor(time_distance/86400000)
         time_distance -= int_day * 86400000;
         // 时
         var int_hour = Math.floor(time_distance/3600000)
         time_distance -= int_hour * 3600000;
         // 分
         var int_minute = Math.floor(time_distance/60000)
         time_distance -= int_minute * 60000;
         // 秒
         var int_second = Math.floor(time_distance/1000)
         // 时分秒为单数时、前面加零
         if(int_day < 10){
         int_day = "0" + int_day;
         }
         if(int_hour < 10){
         int_hour = "0" + int_hour;
         }
         if(int_minute < 10){
         int_minute = "0" + int_minute;
         }
         if(int_second < 10){
         int_second = "0" + int_second;
         }
         // 显示时间
         $("#time_d").html(int_day);
         $("#time_h").html(int_hour);
         $("#time_m").html(int_minute);
         $("#time_s").html(int_second);
         // 设置定时器
         setTimeout("show_time()",1000);
         }


         $(function(){
         $("#searchTip div a").on("click",function(){
         $('#mask, #searchTip').hide();
         })
         })*/
    </script>
</head>
<body>
<div class="page page0 cur">
    <div class="banner">
        <img src="/images/banner.jpg"/>
    </div>
    <div class="content">
        <div class="shopBox">
            <p><b>ShopBox</b> 网红选拔大赛</p>
            <ul>
                <li>
                    <p>参与选手</p>
                    <p><?= $data['enroll_count']?></p>
                </li>
                <li>
                    <p>累计投票</p>
                    <p><?= $data['vote_count']?></p>
                </li>
                <li>
                    <p>访问量</p>
                    <p><?= $data['browsing_count']?></p>
                </li>
            </ul>
            <div class="clock">
                <img src="/images/W1.png"/> 距活动结束还有:<b id="time_d"></b>天 <b id="time_h"></b>时 <b id="time_m"></b>分 <b id="time_s"></b>秒
            </div>
        </div>
        <div class="intr">
            <h4><img src="/images/W2.png"/> 活动介绍</h4>
            <p>活动介绍活动介绍活动介，绍活动介绍活动介绍活动介绍活
                动介绍活动介绍活动介绍，活动介绍活动介绍活动，动介绍
                介绍活动介绍活动介绍。活动介绍活动介绍活动介绍。</p>
        </div>
        <div class="bottom" onclick="javascript:window.location.href='/vote/vote/list'">
            <img  class="xiangxiatishi" src="/images/W3.png" />
        </div>
    </div>
</div>
<div id="mask"><p></p></div>
<div id="searchTip">
    <div class="stepA"><a>知道了</a></div>
</div>
</body>
</html>
